import { Button, Form, Input, Select, message, Switch, Tree } from "antd";
import React, { Component } from "react";
import { mainRouter } from "../../../router/index";
import { roleAdd, roleUpdate } from "../../../api/system";
import { roleLook } from "../../../api/system";
import { userAdd } from "../../../api/user";
const layout = {
  labelCol: {
    span: 6,
  },
  wrapperCol: {
    span: 16,
  },
};
const tailLayout = {
  wrapperCol: {
    offset: 8,
  },
};
const option = [
  {
    value: "jack",
    label: "Jack",
  },
];
class UserFrom extends Component {
  formRef = React.createRef();
  state = {
    roleList: [],
    userInfo: null,
  };
  componentDidMount = () => {
    const { userInfo } = this.props;
    console.log(userInfo);
    roleLook().then((res) => {
      this.setState({
        roleList: res.data.results,
      });
    });
    this.formRef.current.setFieldsValue(userInfo);
  };
  onFinish = (values) => {
    const { roleList } = this.state;
    const leng = roleList.length;
    for (let i = 0; i < leng; i++) {
      if (roleList[i].name == values.role) {
        values.roleId = roleList[i].objectId;
      }
    }
    // console.log(values);
    userAdd(values);
  };
  onReset = () => {
    this.formRef.current.resetFields();
  };
  onCheck = (checkedKeys) => {
    console.log("onCheck", checkedKeys);
    this.formRef.current.setFieldsValue({
      power: checkedKeys,
    });
  };
  render() {
    const { roleInfo } = this.props;
    return (
      <div>
        <Form
          {...layout}
          ref={this.formRef}
          name="control-ref"
          onFinish={this.onFinish}
          initialValues={{
            grounding: false,
          }}
        >
          <Form.Item
            name="username"
            label="用户名称"
            rules={[
              {
                required: true,
              },
            ]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            name="password"
            label="用户密码"
            rules={[
              {
                required: true,
              },
            ]}
          >
            <Input />
          </Form.Item>
          <Form.Item
            name="role"
            label="用户角色"
            rules={[
              {
                required: true,
              },
            ]}
          >
            <Select
              placeholder="角色选择"
              options={this.state.roleList}
              fieldNames={{ label: "name", value: "name" }}
            ></Select>
          </Form.Item>

          <Form.Item {...tailLayout}>
            <Button type="primary" htmlType="submit">
              {roleInfo ? "编辑" : "添加"}
            </Button>
            <Button
              htmlType="button"
              onClick={this.onReset}
              style={{ marginLeft: "10px" }}
            >
              重置
            </Button>
          </Form.Item>
        </Form>
      </div>
    );
  }
}

export default UserFrom;
